<%--
    Date: 2024-05-23
    教师发布并修改授课科目和授课班级。显示当前授课科目和班级信息。
    teacherSubjects.jsp
    ├── 添加成功 --> 刷新页面
    ├── 更新成功 --> 刷新页面
    └── 删除成功 --> 刷新页面
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>教师授课科目管理</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/resources/css/bootstrap.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/resources/css/teacherSubjects.css">
    <script type="text/javascript" src="${pageContext.request.contextPath}/resources/js/jquery-3.7.1.min.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/resources/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/resources/js/updateTime.js"></script>
    <style>
        body {
            background: url('${pageContext.request.contextPath}/resources/img/bg-HYL.jpg') no-repeat center center fixed;
            background-size: cover;
            font-family: Arial, sans-serif;
            margin: 0;
            padding: 0;
            position: relative;
        }
        .overlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(255, 255, 255, 0.8);
            z-index: 1;
        }
        .container {
            position: relative;
            z-index: 2;
            background-color: rgba(255, 255, 255, 0.9);
            padding: 20px;
            border-radius: 8px;
            margin-top: 20px;
        }
        .top-bar {
            background-color: #112d4e;
            color: white;
            text-align: center;
            padding: 10px 0;
            position: fixed;
            width: 100%;
            z-index: 3;
            top: 0;
        }
        .main-content {
            margin-top: 60px;
        }
        .table-custom {
            border-collapse: collapse;
            width: 100%;
            margin: 20px auto;
            opacity: 0.9; /* 设置表格不透明度 */
        }
        th, td {
            padding: 8px;
            text-align: left;
            border-bottom: 1px solid #ddd;
        }
        th {
            background-color: #dbe2ef;
            color: #112d4e;
        }
        td {
            background-color: #f9f7f7;
        }
        .form-group {
            margin-bottom: 15px;
        }
        .form-group label {
            display: block;
            font-weight: bold;
        }
        .form-group input,
        .form-group select,
        .form-group textarea {
            width: 100%;
            padding: 8px;
            margin-top: 5px;
            border: 1px solid #ddd;
            border-radius: 4px;
        }
        .btn-primary {
            background-color: #3f72af;
            color: white;
            border: none;
            padding: 10px 20px;
            cursor: pointer;
            border-radius: 4px;
        }
        .btn-primary:hover {
            opacity: 0.8;
        }
        .btn-secondary {
            background-color: #6c757d;
            color: white;
            border: none;
            padding: 10px 20px;
            cursor: pointer;
            border-radius: 4px;
        }
        .btn-secondary:hover {
            opacity: 0.8;
        }
    </style>
</head>
<body>
<div class="overlay"></div>
<div class="top-bar">
    <span id="currentTime"></span>
</div>
<div class="container main-content">
    <h1 class="text-center mt-4 mb-4">授课班级及科目管理</h1>
    <div class="row">
        <div class="col-md-6">
            <div class="card">
                <div class="text-center card-header">
                    <h2>当前科目列表</h2>
                </div>
                <div class="card-body">
                    <table class="table table-striped table-bordered table-custom">
                        <thead>
                        <tr>
                            <th>科目ID</th>
                            <th>科目名称</th>
                            <th>操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        <c:forEach items="${subjects}" var="subject">
                            <tr>
                                <td>${subject.subjectId}</td>
                                <td>${subject.subjectName}</td>
                                <td>
                                    <form action="<c:url value='/subject/subjects/delete/${subject.subjectId}/${teacherId}'/>" method="post" style="display:inline;">
                                        <button type="submit" class="btn btn-secondary">删除</button>
                                    </form>
                                </td>
                            </tr>
                        </c:forEach>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
        <div class="col-md-6">
            <div class="card">
                <div class="text-center card-header">
                    <h2>当前班级列表</h2>
                </div>
                <div class="card-body">
                    <table class="table table-striped table-bordered table-custom">
                        <thead>
                        <tr>
                            <th>班级ID</th>
                            <th>操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        <c:forEach items="${teacherSubjectClasses}" var="teacherSubjectClass">
                            <tr>
                                <td>${teacherSubjectClass.classId}</td>
                                <td>
                                    <form action="<c:url value='/teachers/${teacherId}/delete/${teacherSubjectClass.classId}'/>" method="post" style="display:inline;">
                                        <button type="submit" class="btn btn-secondary">删除</button>
                                    </form>
                                </td>
                            </tr>
                        </c:forEach>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>

    <div class="card mt-4">
        <div class="text-center card-header">
            <h2>添加授课科目</h2>
        </div>
        <div class="card-body">
            <form action="<c:url value='/subject/add'/>" method="post" class="form">
                <div class="form-group">
                    <label for="subjectName">科目名称:</label>
                    <input type="text" id="subjectName" name="subjectName" required class="form-control">
                </div>
                <input type="hidden" name="teacherId" value="${teacherId}">
                <button type="submit" class="btn btn-primary">添加科目</button>
            </form>
        </div>
    </div>

    <div class="card mt-4">
        <div class="text-center card-header">
            <h2>添加授课班级</h2>
        </div>
        <div class="card-body">
            <form action="<c:url value='/subject/teachers/${teacherId}/add'/>" method="post" class="form">
                <div class="form-group">
                    <label for="classId">班级ID:</label>
                    <input type="text" id="classId" name="classId" required class="form-control">
                </div>
                <input type="hidden" name="teacherId" value="${teacherId}">
                <div class="form-group">
                    <label for="subjectId">科目ID:</label>
                    <input type="text" id="subjectId" name="subjectId" required class="form-control">
                </div>
                <button type="submit" class="btn btn-primary">添加班级</button>
            </form>
        </div>
    </div>
    <div class="text-center mt-3">
        <a href="<c:url value='/teachers/'/>" class="btn btn-secondary">返回教师主页</a>
    </div>
</div>
</body>
</html>